<template>
  <base-breadcrumb title="科技成果完成">
    <div
      v-loading="loading"
      class="about-master-container"
    >
      <a-card>
        <title-name title="基础信息" />
        <a-form-model>
          <a-row>
            <a-col span="8">
              <a-form-model-item label="所属分公司">
                <BaseInput disabled v-model="form.branchCompany" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="项目名称">
                <BaseInput disabled v-model="form.projectName" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-card>
      <a-card v-if="Plan">
        <title-name title="科技管理计划信息" />
        <a-form-model>
          <a-row>
            <a-col span="8">
              <a-form-model-item label="成果名称">
                <BaseInput disabled v-model="Plan.planAchievementsName" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="成果分类">
                <BaseInput disabled v-model="Plan.achievementsType" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="成果等级">
                <BaseInput disabled v-model="Plan.planAchievementsLevel" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="计划完成人">
                <a-tag>{{ Plan.planCompleteEmployee }}</a-tag>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col span="8">
              <a-form-model-item label="计划完成时间">
                <BaseInput disabled v-model="Plan.planCompleteDate" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="计划附件">
                <file-link :file-list="Plan.fileArrays" />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-card>
      <a-card v-if="declare">
        <title-name title="科技成果申报信息" />
        <a-form-model>
            <a-col span="8">
              <a-form-model-item label="成果名称">
                <BaseInput disabled v-model="declare.declareAchievementsName" placeholder="请输入" />
              </a-form-model-item>
            </a-col>

            <a-col span="8">
              <a-form-model-item label="成果分类">
                <BaseInput disabled v-model="declare.declareType" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="成果等级">
                <BaseInput disabled v-model="declare.declareAchievementsLevel" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="24">
              <a-form-model-item label="申报人">
                <a-tag v-for="item in declare.joinEmployee" :key="item.employeeName">
                  {{ item.employeeName }}
                </a-tag>
                <span v-if="!declare.joinEmployee || declare.joinEmployee.length == 0">无</span>
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="申报日期">
                <BaseInput disabled v-model="declare.declareDate" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="附件">
                <file-link :file-list="declare.fileArrays" />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-card>
      <a-card>
        <title-name title="科技成果完成情况" />
        <div class="descriptions">
          <a-form-model
            ref="form"
            :model="queryParam"
            :rules="rules"
          >
            <a-row>
              <a-col span="8">
                <a-form-model-item
                  label="完成状态"
                >
                  <a-select
                    disabled
                    v-model="queryParam.completionStatus"
                    placeholder="请选择"
                  >
                    <a-select-option value="4">
                      获得
                    </a-select-option>
                    <a-select-option value="5">
                      未获得
                    </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col span="8">
                <a-form-model-item
                  label="完成成果名称"
                >
                  <BaseInput
                    disabled
                    v-model.trim="queryParam.completeAchievementsName"
                    placeholder="请输入完成成果名称"
                  />
                </a-form-model-item>
              </a-col>
              <a-col span="8">
                <a-form-model-item
                  label="成果分类"
                >
                  <a-select
                    disabled
                    v-model="queryParam.achievementsTypeId"
                    placeholder="请选择"
                    @change="getLevelList"
                  >
                    <a-select-option
                      v-for="item in ClassifyList"
                      :key="item.id"
                      :value="item.id"
                    >
                      {{ item.name }}
                    </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col span="8">
                <a-form-model-item
                  label="成果等级"
                >
                  <a-select
                    disabled
                    v-model="queryParam.completeAchievementsLevelId"
                    placeholder="请选择"
                    @change="completeAchievementsLevelIdChange($event)"
                  >
                    <a-select-option
                      v-for="item in LevelList"
                      :key="item.id"
                      :value="item.id"
                    >
                      {{ item.levelName }}
                    </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col span="16">
                <a-form-model-item
                  label="完成人"
                >
                  <a-tag
                    v-for="item in queryParam.completeEmployee"
                    :key="item.userId"
                  >
                    {{ item.empName }}
                  </a-tag>

                  <span class="del_btn mr20">（按证书上面完成人顺序填写）</span>
                </a-form-model-item>
              </a-col>
            </a-row>
            <a-row>
              <a-col span="8">
              <a-form-model-item
                label="成果完成单位"
                prop="completeOrgDTOS"
              >
                <a-tag
                  v-for="item in queryParam.completeOrgDTOS"
                  :key="item.completeOrgId"
                >
                  {{ item.completeOrgName }}
                </a-tag>
              </a-form-model-item>
            </a-col>
              <a-col span="8">
                <a-form-model-item
                  label="完成日期"
                >
                  <a-date-picker
                    disabled
                    v-model="queryParam.completeDate"
                    type="date"
                    value-format="YYYY-MM-DD HH:mm:ss"
                  />
                </a-form-model-item>
              </a-col>
              <a-col span="8">
                <a-form-model-item
                  label="标引"
                >
                  <a-tree-select
                    disabled
                    multiple
                    :value="queryParam.indexInfo"
                    style="width: 100%"
                    :tree-data="indexInfoList"
                    :replaceFields="	{children:'children', title:'name', key:'id', value: 'id' }"
                    :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                    placeholder="请选择"
                  ></a-tree-select>
                </a-form-model-item>
              </a-col>
            </a-row>
            <a-row>

              <!--                研发立项-->
              <template v-if="achievementsTypeName === '研发立项'">
                <a-col span="8">
                  <a-form-model-item
                    label="立项编号"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.projectCode"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="实施情况" prop="progressSituation">
                    <BaseInput
                      v-model.trim="queryParam.progressSituation"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="起始时间"
                  >
                    <a-date-picker
                      disabled
                      v-model="queryParam.beginAndEndTime"
                      type="date"
                      value-format="YYYY-MM-DD HH:mm:ss"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="计划验收时间"
                  >
                    <a-date-picker
                      disabled
                      v-model="queryParam.planDate"
                      type="date"
                      value-format="YYYY-MM-DD HH:mm:ss"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="实际验收时间" prop="factDate">
                    <a-date-picker
                      v-model="queryParam.factDate"
                      type="date"
                      value-format="YYYY-MM-DD HH:mm:ss"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="总经费（万）"
                  >
                    <BaseInputNumber
                      disabled
                      :precision="6"
                      v-model="queryParam.totalFee"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="资助经费（万）"
                  >
                    <BaseInputNumber
                      disabled
                      :precision="6"
                      v-model.trim="queryParam.subsidizeFee"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="课题负责人"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.classPrincipalPeople"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="证书编号" prop="certificateCode">
                    <BaseInput
                      v-model.trim="queryParam.certificateCode"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="课题研发人员" prop="classDiscoveryPeople">
                    <BaseInput
                      v-model.trim="queryParam.classDiscoveryPeople"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="16">
                  <a-form-model-item
                    :key="1"
                    label="备注"
                  >
                    <BaseInput
                      v-model.trim="queryParam.remark"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
              </template>

              <!--                示范工程立项-->
              <template v-if="achievementsTypeName === '示范工程立项'">
                <a-col span="8">
                  <a-form-model-item
                    label="立项编号"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.projectCode"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="实施情况" prop="progressSituation">
                    <BaseInput
                      v-model.trim="queryParam.progressSituation"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="实施状态" prop="implementStatus">
                    <BaseInput
                      v-model.trim="queryParam.implementStatus"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="计划验收时间"
                  >
                    <a-date-picker
                      disabled
                      v-model="queryParam.planDate"
                      type="date"
                      value-format="YYYY-MM-DD HH:mm:ss"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="实际验收时间" prop="factDate">
                    <a-date-picker
                      v-model="queryParam.factDate"
                      type="date"
                      value-format="YYYY-MM-DD HH:mm:ss"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="立项机构"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.projectOrg"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="立项级别"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.projectLevel"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="项目负责人"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.projectPrincipalPeople"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="主要推广人员" prop="majorPromotePeople">
                    <BaseInput
                      v-model.trim="queryParam.majorPromotePeople"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="地点"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.placeInfo"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="计划开竣工时间"
                  >
                    <a-range-picker
                      disabled
                      v-model="queryParam.startAndEndTime"
                      type="date"
                      value-format="YYYY-MM-DD HH:mm:ss"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="规模"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.scope"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    prop="certificateCode"
                    label="证书编号"
                  >
                    <BaseInput
                      v-model.trim="queryParam.certificateCode"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="16">
                  <a-form-model-item
                    :key="2"
                    label="备注"
                  >
                    <BaseInput
                      v-model.trim="queryParam.remark"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
              </template>

              <!--                国家知识产权-专利-->
              <template v-if="completeAchievementsLevelName1 === '发明专利' || completeAchievementsLevelName1 === '实用新型专利'">
                <a-col span="8">
                  <a-form-model-item
                    label="专利号"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.patentNo"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="申请日"
                  >
                    <a-date-picker
                      disabled
                      v-model="queryParam.applyDay"
                      type="date"
                      value-format="YYYY-MM-DD HH:mm:ss"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="公告日" prop="announcementDay">
                    <a-date-picker
                      v-model="queryParam.announcementDay"
                      type="date"
                      value-format="YYYY-MM-DD HH:mm:ss"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item
                    label="片区"
                  >
                    <BaseInput
                      disabled
                      v-model.trim="queryParam.zone"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
                <a-col span="8">
                  <a-form-model-item label="状态" prop="teachStatus">
                    <a-select v-model="queryParam.teachStatus">
                      <a-select-option value="1">授权</a-select-option>
                      <a-select-option value="2">受理</a-select-option>
                    </a-select>
                  </a-form-model-item>
                </a-col>
                <a-col span="24">
                  <a-form-model-item
                    :key="4"
                    label="备注"
                  >
                    <BaseInput
                      v-model.trim="queryParam.remark"
                      placeholder="请输入"
                    />
                  </a-form-model-item>
                </a-col>
              </template>

              <a-col span="8">
                <a-form-model-item
                  label="附件上传"
                  prop="fileArrays"
                >
                  <upload-list
                    :is-close="false"
                    :is-show="false"
                    business-code="STM05"
                    :upload-arrys.sync="queryParam.fileArrays"
                  />
                </a-form-model-item>
              </a-col>
            </a-row>
          </a-form-model>
        </div>
      </a-card>
      <div class="pull-right">
        <a-button
          style="margin: 0 10px"
          type="primary"
          @click="submitComplete"
        >
          提交
        </a-button>
        <a-button
          style="margin: 0 10px"
          @click="$multiTab.close()"
        >
          关闭
        </a-button>
      </div>
    </div>

    <SelectPerson
      :max-select-length="canAddPeopleLength"
      :visible.sync="visible2"
      title="添加完成人"
      :list.sync="queryParam.completeEmployee"
    />
  </base-breadcrumb>
</template>

<script>
import { getDeclare, addComplete, titleLabelQuery } from '@/api/achievementsManage'
import { getClassifyList, getGradeList } from '@/api/achievementsType'
import Madel from '../plots/components/Madel'
import deleteFun from './delete.js'
import Model from '@/views/science/plots/components/Model'
import BaseEditPage from '@/views/baseEditPage'
import UploadList from '@/components/UploadList'
import SelectPerson from '@/components/Select/SelectPerson'

export default {
  extends: new BaseEditPage(),
  data() {
    return {
      queryParam: {
        beginAndEndTime: '',
        completionStatus: undefined,
        teachStatus: undefined,
        completeEmployee: []
      },
      Plan: null,
      declare: null,
      rules: {
        progressSituation: [{ required: true, message: '请输入实施情况', trigger: 'change' }],
        factDate: [{ required: true, message: '请输入实际验收时间', trigger: 'change' }],
        certificateCode: [{ required: true, message: '请输入证书编号', trigger: 'change' }],
        classDiscoveryPeople: [{ required: true, message: '请输入课题研发人员', trigger: 'change' }],
        implementStatus: [{ required: true, message: '请输入实施状态', trigger: 'change' }],
        majorPromotePeople: [{ required: true, message: '请输入主要推广人员', trigger: 'change' }],
        teachStatus: [{ required: true, message: '请输入状态', trigger: 'change' }],
        announcementDay: [{ required: true, message: '请输入公告日', trigger: 'change' }]
      },
      form: {},
      loading: false,
      ClassifyList: [],
      LevelList: [],
      indexInfoList: [],
      disabled: false,
      visible2: false,
      achievementsTypeName: '',
      completeAchievementsLevelName1: ''
    }
  },
  components: {
    UploadList,
    SelectPerson
  },
  computed: {
    canAddPeopleLength() {
      if (this.achievementsTypeName === '研发立项' || this.achievementsTypeName === '示范工程立项') {
        if (this.completeAchievementsLevelName1.includes('局') || this.completeAchievementsLevelName1.includes('省')) {
          return 15
        }
      }
      return 100
    }
  },
  mounted() {
    this.getIndexInfoList()
    this.getData()
  },
  methods: {
    async getIndexInfoList() {
      let res = await titleLabelQuery()
      if (res.code === this.SUCCESS_CODE) {
        this.indexInfoList = res.data
      }
    },
    async getData() {
      this.loading = true
      let res1 = await getClassifyList({ status: '1' })
      if (res1.code == this.SUCCESS_CODE) {
        this.ClassifyList = res1.data
      }
      let res = await getDeclare({ id: this.id })
      this.loading = false
      if (res.code === this.SUCCESS_CODE) {
        this.form = res.data
        this.declare = res.data.sciencesDeclare
        this.Plan = res.data.sciencesPlan
        this.queryParam = res.data.sciencesComplete || {
          completionStatus: undefined,
          teachStatus: undefined,
          completeEmployee: [],
          beginAndEndTime: '',
          indexInfo: []
        }
        console.log(this.queryParam)
        if (!this.queryParam.teachStatus) {
          this.queryParam.teachStatus = undefined
        }
        if (this.queryParam.indexInfo) {
          try {
            this.queryParam.indexInfo = JSON.parse(this.queryParam.indexInfo)
          }catch (e){
            this.queryParam.indexInfo = []
          }
        } else {
          this.queryParam.indexInfo = []
        }
        try {
          if (this.queryParam.startAndEndTime) {
            this.queryParam.startAndEndTime = JSON.parse(this.queryParam.startAndEndTime)
          }
        } catch (e) {
        }
        if (this.queryParam.newCompleteEmployee) {
          // this.queryParam.completeEmployee = this.queryParam.newCompleteEmployee.map(v => {
          //   return { name: v.employeeName, id: v.employeeId }
          // })
        }
        res.data.completeStatusNameCode && (this.queryParam.completionStatus = res.data.completeStatusNameCode.toString())
        this.queryParam.achievementsTypeId && await this.getLevelList(this.queryParam.achievementsTypeId, true)
        this.queryParam.completeAchievementsLevelId && this.completeAchievementsLevelIdChange(this.queryParam.completeAchievementsLevelId, true)
      }
    },
    async getLevelList(typeId, init = false) {
      this.$refs.form.clearValidate()
      if (!init) {
        this.$set(this.queryParam, 'completeAchievementsLevelId', '')
      }
      let temp = this.ClassifyList.find(v => v.id === typeId)
      if (temp) {
        this.achievementsTypeName = temp.name
      }
      let res = await getGradeList({ typeId: this.queryParam.achievementsTypeId, status: '1' })
      if (res.code === this.SUCCESS_CODE) {
        this.LevelList = res.data.data
      }
    },
    completeAchievementsLevelIdChange(e, init = false) {
      let temp = this.LevelList.find(v => v.id === e)
      if (temp) {
        this.completeAchievementsLevelName1 = temp.levelName
        console.log(init)
        if (!init) {
          this.queryParam.completeEmployee = []
        }
      }
    },
    findTreeDataName(list, id) {
      let res
      for (let i = 0; i < list.length; i++) {
        if (res) break
        let v = list[i]
        if (v.id === id) {
          res = v.name
        } else {
          if (v.children && v.children.length) {
            res = this.findTreeDataName(v.children, id)
          }
        }
      }
      return res
    },
    submitComplete() {
      this.$refs.form.validate(async (valid) => {
        if (valid) {
          this.$submitConfirm(async () => {
            let temp = this.$clone(this.queryParam)
            // temp.completeEmployee = this.queryParam.completeEmployee.map(v => {
            //   return { employeeName: v.name, employeeId: v.id }
            // })
            if (temp.startAndEndTime) {
              temp.startAndEndTime = JSON.stringify(temp.startAndEndTime)
            }
            temp.strIndexInfo = []
            temp.indexInfo.map(v => {
              let res = this.findTreeDataName(this.indexInfoList, v)
              temp.strIndexInfo.push(res)
            })
            temp.strIndexInfo = temp.strIndexInfo.join(',')
            temp.indexInfo = JSON.stringify(temp.indexInfo)
            temp.achievementsId = this.id
            temp.supplement = 1
            this.loading = true
            let res = await addComplete(temp)
            this.loading = false
            if (res.code === this.SUCCESS_CODE) {
              this.$noticeSuccess('提交成功')
              this.$close()
            }
          }, '确认提交？')
        } else {
          this.$noticeWarning('请填写完整')
        }
      })
    }
  }
}
</script>